<template>
    <div>
        <h1>App</h1>
        <input type="text" v-model="fullName">
        {{ fullName }}
    </div>
</template>
<script setup>
import { computed, ref } from 'vue';

const firstName = ref('li');
const lastName = ref('jack');
const fullName = computed({
    get() {
        return `${lastName.value} ${firstName.value}`
    },
    set(value) {
        [lastName.value, firstName.value] = value.split(' ');
    }
})


// const fullName = computed(() => {
//     return `${lastName.value} ${firstName.value}`
// })

</script>

<style>
div {
    border: solid;
    padding: 10px;
}
</style>